<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
	</head>
	<body>
		<div onclick="alert('❤')" class="heart">
		<div class="h1"></div>
		<div class="h2"></div>
		<div class="h3"></div>
		</div>
		<style>
				
			.h1{
				width:200px;
			    height:200px;
				background-color:red;
				transform:rotate(45deg);
				position:absolute;
				top:200px;
				left:400px;
				box-shadow: 0px 0px 0px 0px red;
			}
			.h2{
				width:200px;
			    height:100px;
				background-color:red;
				border-radius:100px 100px 0 0;
				transform:rotate(-45deg);
					position:absolute;
				top:145px;
				left:295px;
				box-shadow: 0px 0px 0px 0px red;
			}
			.h3{
				width:200px;
			    height:100px;
				background-color:red;
				border-radius:100px 100px 0 0;
				transform:rotate(45deg);
				position:absolute;
				top:145px;
				left:505px;
				box-shadow: 0px 0px 0px 0px red;
			}
			.heart{
				animation:heart 300ms infinite alternate;
				}
				@keyframes heart {
					
				
				0%{
					transform:scale(1);
				}
				100%{
					transform:scale(1.2);
				}
				}
			
			
			</style>
	</body>
</html>